<template>
  <div class="page">
    <div class="page__hd">
      <van-divider
          :style="{ color: '#1989fa', borderColor: '#1989fa', padding: '0 16px' }"
      >
        身份验证
      </van-divider>
      <p class="page__desc">企业微信应用Oauth登录，可自动跳转</p>
      <p class="page__desc">当前url: {{ url }}</p>
    </div>
    <div class="page__bd page__bd_spacing">
      <div class="weui-flex">
        <div class="weui-flex__item">
          <div class="placeholder">
                <van-button
                    type="info"
                    size="large"
                    class="question-botton" @click="getOauthUrl">H5应用OAuth授权登录
                </van-button>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import {oauthUrl} from '../api/user'
import { mapGetters, mapActions } from 'vuex'
export default {
  name: "Auth",
  computed: {
    ...mapGetters([
      'userToken'
    ]),
    url() {
      return window.location.href
    }
  },
  methods: {
    getOauthUrl() {
      let oauthCallback = encodeURI(window.location.protocol + '//' + window.location.host + "/callback")
      //console.log(oauthCallback)
      let params = {'oauth_callback': oauthCallback}
      oauthUrl(params).then((res) => {
        alert(res.data.oauth_url)
        window.location.href = res.data.oauth_url
      });
    },
  }
}
</script>

<style scoped>
.page__desc{
  font-size: 15px;
}
</style>